<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8"/>
    <title>登录页面 - Bootstrap后台管理系统模版Ace下载</title>
    <meta name="keywords" content="Bootstrap模版,Bootstrap模版下载,Bootstrap教程,Bootstrap中文"/>
    <meta name="description" content="站长素材提供Bootstrap模版,Bootstrap教程,Bootstrap中文翻译等相关Bootstrap插件下载"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>

    <!-- basic styles -->

    <link href="/static/css/bootstrap.min.css" rel="stylesheet"/>
    <link rel="stylesheet" href="/static/css/font-awesome.min.css"/>

    <link rel="stylesheet" href="/static/css/font-awesome-ie7.min.css"/>


    <link rel="stylesheet" href="/static/css/ace.min.css"/>
    <link rel="stylesheet" href="/static/css/ace-rtl.min.css"/>


    <script type="text/javascript">
        window.jQuery || document.write("<script src='/static/js/jquery-3.4.1.min.js'>" + "<" + "/script>");
    </script>
    <![endif]-->

    <script type="text/javascript">
        if ("ontouchend" in document) document.write("<script src='/static/js/jquery.mobile.custom.min.js'>" + "<" + "/script>");
    </script>

    <!-- inline scripts related to this page -->

    <script type="text/javascript">
        function show_box(id) {
            $('.widget-box.visible').removeClass('visible');
            $('#' + id).addClass('visible');
            //清空注册表单的错误信息
            $("#registererrorinfo").html('');
        }
    </script>
    <script type="text/javascript">
        $(function () {
            $("#registerBtn").click(function () {
                if ($("#rusername").val() === "" || $("#rpassword").val() === ""
                    || $("#rphone").val() === "") {
                    alert("用户名和密码或电话不能为空");
                    return;
                }
                // console.log($("#registerForm").serialize());
                //提交表单
                let formParamsArray = $("#registerForm").serializeArray();
                // console.log("formParamsArray=" + formParamsArray);
                let restJson = {};
                for (let i = 0; i < formParamsArray.length; i++) {
                    let param = formParamsArray[i];
                    restJson[param.name] = param.value;
                }
                //将数组元素用逗号拼接成字符串
                let restJsonStr = JSON.stringify(restJson);
                $.ajax({
                    url: 'http://localhost:8080/user/register',
                    type: 'POST',
                    dataType: 'json',
                    data: restJsonStr,
                    cache: false,
                    async: false,//同步的方式
                    contentType: "application/json",
                    statusCode: {
                        500: function (response) {
                            alert("系统内部异常，请稍后再试")
                        },
                        400: function (response) {
                            alert("表单参数不合法!")
                            // console.log(response.responseJSON.msg)
                            $("#registererrorinfo").html(response.responseJSON.msg)
                        },
                        403: function (response) {
                            alert("您无权操作该资源!")
                        }
                    },
                    success: function (jsonResult) {
                        console.log(jsonResult.code)
                        if (jsonResult.code == "1") {
                            alert(jsonResult.msg);
                        } else if ("0" == jsonResult.code) {
                            alert(jsonResult.msg);
                            show_box('login-box');
                        }
                        // if (jsonResult.resultCode === 'SUCCESS') {
                        // if (jsonResult === null || jsonResult === "") {
                        //     alert("注册失败,该用户名已被注册");
                        // } else {
                        //     alert("注册成功");
                        //     show_box('login-box');
                        // }
                    }
                });
            });
            $("#username").blur(function () {
                if ($("#username").val() === "") {
                    alert("用户名不能为空");
                    return;
                }
            })
            $("#subBtn").click(function () {
                if ($("#username").val() === "" || $("#password").val() === "") {
                    alert("用户名或密码不能为空");
                    return;
                }
                $.ajax({
                    url: "http://localhost:8080/user/checkUser/" + $("#username").val() + "/" + $("#password").val(),
                    type: "GET",
                    dataType: "json",
                    contentType: "application/json",
                    success: function (resultJson) {
                        if (resultJson.code == "1") {
                            alert(resultJson.msg);
                        } else if ("2" == resultJson.code) {
                            alert(resultJson.msg);
                        } else if ("3" == resultJson.code) {
                            alert(resultJson.msg);
                        } else {
                            $("#loginForm").submit();
                        }
                    }
                })
            })

        })
    </script>
</head>

<body class="login-layout">
<div class="main-container">
    <div class="main-content">
        <div class="row">
            <div class="col-sm-10 col-sm-offset-1">
                <div class="login-container">
                    <div class="center">
                        <h1>
                            <i class="icon-leaf green"></i>
                            <span class="red">BY</span>
                            <span class="white">后台管理系统</span>
                        </h1>
                        <h4 class="blue">&copy; 和盈</h4>
                    </div>

                    <div class="space-6"></div>

                    <div class="position-relative">
                        <div id="login-box" class="login-box visible widget-box no-border">
                            <div class="widget-body">
                                <div class="widget-main">
                                    <h4 class="header blue lighter bigger">
                                        <i class="icon-coffee green"></i>
                                        用户登录
                                    </h4>

                                    <div class="space-6"></div>

                                    <form id="loginForm" action="/user/login" method="post">
                                        <fieldset>
                                            <label class="block clearfix">
														<span class="block input-icon input-icon-right">
															<input type="text" name="username" id="username"
                                                                   class="form-control" placeholder="用户名"/>
															<i class="icon-user"></i>
														</span>
                                            </label>

                                            <label class="block clearfix">
														<span class="block input-icon input-icon-right">
															<input type="password" name="password" id="password"
                                                                   class="form-control" placeholder="密码"/>
															<i class="icon-lock"></i>
														</span>
                                            </label>

                                            <div class="space"></div>

                                            <div class="clearfix">
                                                <label class="inline">
                                                    <input type="checkbox" class="ace" name="remember-me" value="true"/>
                                                    <span class="lbl"> 记住我</span>
                                                </label>

                                                <button type="button" id="subBtn"
                                                        class="width-35 pull-right btn btn-sm btn-primary">
                                                    <i class="icon-key"></i>
                                                    登录
                                                </button>
                                            </div>

                                            <div class="space-4"></div>
                                            <label class="block clearfix">
                                                <span style="color: red" th:text="${info}"></span>
                                            </label>
                                            <div class="space-4"></div>
                                        </fieldset>
                                    </form>

                                    <div class="social-or-login center">
                                        <span class="bigger-110 red"></span>
                                    </div>
                                </div><!-- /widget-main -->

                                <div class="toolbar clearfix">
                                    <div>
                                        <a href="#" onclick="show_box('forgot-box'); return false;"
                                           class="forgot-password-link">
                                            <i class="icon-arrow-left"></i>
                                            忘记密码
                                        </a>
                                    </div>

                                    <div>
                                        <a href="#" onclick="show_box('signup-box'); return false;"
                                           class="user-signup-link">
                                            新用户注册
                                            <i class="icon-arrow-right"></i>
                                        </a>
                                    </div>
                                </div>
                            </div><!-- /widget-body -->
                        </div><!-- /login-box -->

                        <div id="forgot-box" class="forgot-box widget-box no-border">
                            <div class="widget-body">
                                <div class="widget-main">
                                    <h4 class="header red lighter bigger">
                                        <i class="icon-key"></i>
                                        Retrieve Password
                                    </h4>

                                    <div class="space-6"></div>
                                    <p>
                                        Enter your email and to receive instructions
                                    </p>

                                    <form>
                                        <fieldset>
                                            <label class="block clearfix">
														<span class="block input-icon input-icon-right">
															<input type="email" class="form-control"
                                                                   placeholder="Email"/>
															<i class="icon-envelope"></i>
														</span>
                                            </label>

                                            <div class="clearfix">
                                                <button type="button" class="width-35 pull-right btn btn-sm btn-danger">
                                                    <i class="icon-lightbulb"></i>
                                                    Send Me!
                                                </button>
                                            </div>
                                        </fieldset>
                                    </form>
                                </div><!-- /widget-main -->

                                <div class="toolbar center">
                                    <a href="#" onclick="show_box('login-box'); return false;"
                                       class="back-to-login-link">
                                        返回登录
                                        <i class="icon-arrow-right"></i>
                                    </a>
                                </div>
                            </div><!-- /widget-body -->
                        </div><!-- /forgot-box -->

                        <div id="signup-box" class="signup-box widget-box no-border">
                            <div class="widget-body">
                                <div class="widget-main">
                                    <h4 class="header green lighter bigger">
                                        <i class="icon-group blue"></i>
                                        用户注册
                                    </h4>

                                    <div class="space-6"></div>
                                    <p> 请输入您的信息: </p>

                                    <form id="registerForm">
                                        <!--<label class="block clearfix">-->
                                        <!--			<span class="block input-icon input-icon-right">-->
                                        <!--				<input type="text" class="form-control" name="uno"-->
                                        <!--                       placeholder="用户编号"/>-->
                                        <!--				<i class="icon-credit-card"></i>-->
                                        <!--			</span>-->
                                        <!--</label>-->

                                        <label class="block clearfix">
														<span class="block input-icon input-icon-right">
															<input type="text" class="form-control" name="username"
                                                                   id="rusername"
                                                                   placeholder="用户名"/>
															<i class="icon-user"></i>
														</span>
                                        </label>

                                        <label class="block clearfix">
														<span class="block input-icon input-icon-right">
															<input type="password" class="form-control" name="password"
                                                                   id="rpassword"
                                                                   placeholder="密码"/>
															<i class="icon-lock"></i>
														</span>
                                        </label>
                                        <label class="block clearfix">
														<span class="block input-icon input-icon-right">
															<input type="text" class="form-control" name="phone"
                                                                   id="rphone"
                                                                   placeholder="电话"/>
															<i class="icon-phone"></i>
														</span>
                                        </label>

                                        <!--<label class="block clearfix">
                                                    <span class="block input-icon input-icon-right">
                                                        <input type="email" class="form-control" name="email"
                                                               placeholder="电子邮箱"/>
                                                        <i class="icon-envelope"></i>
                                                    </span>
                                        </label>-->

                                        <!--                                            <label class="block clearfix">-->
                                        <!--														<span class="block input-icon input-icon-right">-->
                                        <!--															<input type="password" class="form-control" placeholder="重复密码" />-->
                                        <!--															<i class="icon-retweet"></i>-->
                                        <!--														</span>-->
                                        <!--                                            </label>-->

                                        <!--                                            <label class="block">-->
                                        <!--                                                <input type="checkbox" class="ace" />-->
                                        <!--                                                <span class="lbl">-->
                                        <!--															我同意-->
                                        <!--															<a href="#">使用协议</a>-->
                                        <!--														</span>-->
                                        <!--                                            </label>-->

                                        <div class="space-24"></div>

                                        <div class="clearfix">
                                            <button type="reset" class="width-30 pull-left btn btn-sm">
                                                <i class="icon-refresh"></i>
                                                重置
                                            </button>

                                            <button type="button" id="registerBtn"
                                                    class="width-65 pull-right btn btn-sm btn-success">
                                                注册
                                                <i class="icon-arrow-right icon-on-right"></i>
                                            </button>
                                        </div>

                                        <div class="space-4"></div>
                                        <label class="block" id="registererrorinfo" style="color:red">
                                        </label>
                                    </form>
                                </div>

                                <div class="toolbar center">
                                    <a href="#" onclick="show_box('login-box'); return false;"
                                       class="back-to-login-link">
                                        <i class="icon-arrow-left"></i>
                                        返回登录
                                    </a>
                                </div>
                            </div><!-- /widget-body -->
                        </div><!-- /signup-box -->
                    </div><!-- /position-relative -->
                </div>
            </div><!-- /.col -->
        </div><!-- /.row -->
    </div>
</div><!-- /.main-container -->
</body>
</html>